<template>
  <div class="house">
    <t-select v-model="value2" label="房产：" placeholder="请选择房产" auto-width @change="handleChange">
      <t-option v-for="item in options" :key="item.value" :value="item.value" :label="item.label"></t-option>
    </t-select>
  </div>
  <t-loading :loading="loading" text="加载中..." fullscreen />
</template>

<script setup lang="ts">
import { onMounted, ref } from 'vue';
import { MessagePlugin } from 'tdesign-vue-next';

import { getProperty, sortProperty } from '@/api/house/property';

defineProps({
  layout: String,
});

// 加载
const loading = ref(false);

const options = ref([]);
const value2 = ref('');

const handleChange = async (value: any) => {
  try {
    loading.value = true;
    await sortProperty({ id: value });
    location.reload();
  } catch (e) {
    if (e.response && e.response.data.code === 995) {
      MessagePlugin.error(e.response.data.message);
    } else {
      MessagePlugin.error('系统错误');
    }
  } finally {
    loading.value = false;
  }
};

const queryProperty = async () => {
  try {
    const { list } = await getProperty();
    list.forEach((element, index) => {
      options.value.push({ label: element.name, value: element.id });
      if (element.firstly == 'Y') {
        value2.value = element.id;
        localStorage.setItem('propertyID', element.id);
        localStorage.setItem('propertyName', element.name);
      }
    });
  } catch (e) {
    if (e.response && e.response.data.code === 995) {
      MessagePlugin.error(e.response.data.message);
    } else {
      MessagePlugin.error('系统错误');
    }
  }
}

// 用于在组件挂载到 DOM 上之后执行一些操作
onMounted(() => {
  queryProperty();
});

</script>

<style lang="less" scoped>
.house {
  margin: 0 8px;
  transition: opacity @anim-duration-base @anim-time-fn-easing;
}
</style>
